<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>
<%@ taglib prefix ="s" uri="/struts-tags"%>
<!DOCTYPE html>
<html lang="en">
	<head>
		
		<%@ include file="/common/common-css.jsp"%>
		
		<!-- loading -->
		<link rel="stylesheet" href="/xmiles-manager/css/common-loading.css">
		
		<style>
			#jquery-table td {
				cursor: pointer !important
			}
			
			.productthumbnail {
				width: 100px;
				height: 100px;
			}
			
			@media (min-width: 768px) and (max-width: 1200px) {
				.backup-text {
					width: 100px !important;
				}
			}
		</style>
	</head>
	<body  class="no-skin">
		
		<!-- loading -->
		<%@ include file="/common/common-loading.jsp"%>
			
		<div class="page-content">
			<div class="page-header" style="margin-bottom:0px;padding-bottom:10px;">
			
				<h1 id="fu_name">
					
				</h1>
			</div>
			<form id="queryForm" method="post">
			<div class="page-content-area">
				<div class="row">
					<div class="col-sm-12">
						<div class="widget-box" style="border:0px solid #ccc; border-top:none;border-bottom:none;">
							<div class="widget-header widget-header-blue widget-header-flat">
								<h4 class="widget-title">推广渠道管理</h4>
		
								<div class="widget-toolbar">
									<a href="#" data-action="collapse">
										<i class="ace-icon fa fa-chevron-up"></i>
									</a>
								</div>
							</div>
		
							<div class=" widget-body">
								<!-- <div class="widget-main" style="padding:12px;border:0px solid #ccc; border-top:none;border-bottom:none;"> -->
									<div class="widget-main" >
										<div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3">
											<label class="col-sm-6 control-label"  style="text-align:right" for="name">渠道名:</label>
											<div class="col-sm-6">
												<input type="text" class="input-sm form-control" style="padding-left:0px" name="channel_name" id ="channel_name">
											</div>
										</div>
										
																			
									</div><!-- /.widget-main -->
							</div><!-- /.widget-body -->
						</div><!-- /.widget-box -->
					</div><!-- /.col-sm-12 -->
						<div class="col-md-12 center">
						<div class="clearfix form-actions">
						
							<button class="btn btn-purple  no-border" type="button" name="btn-query" onclick="query_any()" id="btn-query">
								<i class="ace-icon fa fa-search icon-on-right bigger-110"></i>
								查询
							</button>
							&nbsp;&nbsp;&nbsp;
							<button class="btn btn-success  no-border" type="reset" onclick="opAddChannel()">
								<i class="ace-icon fa fa-undo icon-on-right bigger-110"></i>
								新增
							</button>
							
						  </div>
				   </div>
				</div><!-- /.row -->
						 
				
		 		<div class="row">
					<div class="col-xs-12">
						<table id="jquery-table" class="table table-striped table-bordered table-hover">
						</table>
					</div><!-- /.col -->
				</div><!-- /.row -->
					
			</div><!-- /.page-content-area -->
			</form>
		</div><!-- /.page-content -->
	</body>
</html>

<%@ include file="/common/common-js.jsp" %>
<!-- loading js -->
<script type="text/javascript" src="${ctx}/js/common-loading.js"></script>
<%-- <script type="text/javascript" src="${ctx}/js/call_func.js"></script> --%>
<link rel="stylesheet" href="${ctx}/ace/css/just-tip.css"/>
<script src="${ctx}/ace/js/justTools.js"></script>

<!-- inline scripts related to this page -->
<script type="text/javascript">
	
	/* //导出列表
	function loadlist(){
		var form = document.forms["queryForm"];
		form.action= ctx + "/finance/exportGasPkgDetail.action";
		form.submit();
	} */
	
	
	
    //【查询】按钮Click事件
	function query_any(){
	 	$("#output").removeAttr("style");
		if(jqTable != null){
			jqTable.fnDraw();
		} else {
			loaddata();
		}
		 $("#delete_btn").attr("style","display:block");
		 $("#delete_hr").attr("style","margin-top:0px;margin-bottom:20px;display:block");
	 };
	  
	 
	$(document).ready(function(){
		query_any();
	});
	
	var jqTable = null;
	
	var loaddata = function(){
		jQuery(function($) {
			jqTable = $('#jquery-table').dataTable( {
			    //数据列控制（包括对应返回JSON属性名称，对应表头列索引位置、数据转换封装等）
			    "columnDefs": [
			    		{	  
						  "title":'产品ID',
						  "name":"prdId",
						  "data": "prdId",
						  "targets": [0],
						  "class": "center",
						  "bSortable": false,
						  "width": "15%",
					},
					{	  
						  "title":'产品名',
						  "name":"prdName",
						  "data": "prdName",
						  "targets": [1],
						  "class": "center",
						  "bSortable": false,
						  "width": "15%"
					},
					{	  
						  "title":'推广链接',
						  "name":"spreadLink",
						  "data": "spreadLink",
						  "targets": [2],
						  "class": "center",
						  "bSortable": false,
						  "width": "45%"
					},
					{	  
						  "title":'操作',
						  "name":"operation",
						  "data": "operation",
						  "targets": [3],
						  "class": "center",
						  "bSortable": false,
						  //"width": "1%",
						  "render": function(value, type, row) {
							  var statusClass = "btn-success";
							  if(row.prdId){
								
							  	var text = "<a class='btn btn-send " + statusClass + " btn-sm' href='javascript:void(0)' data-PrdId=" + row.prdId + " data-prdName=" + row.prdName + " data-spreadLink=" + row.spreadLink + " onclick='updateChannel(this)'>更新</a> &nbsp;"
							  	         + "<a class='btn btn-send " + statusClass + " btn-sm' href='javascript:void(0)' data-PrdId=" + row.prdId + " data-prdName=" + row.prdName + " data-spreadLink=" + row.spreadLink + " onclick='opDropChannel(this)'>删除</a> &nbsp;" + "";
							  }else
								var text = "<a class='btn btn-send " + statusClass + " btn-sm' href='javascript:void(0)' data-PrdId=" + row.prdId + " data-prdName=" + row.prdName + " data-spreadLink=" + row.spreadLink + " onclick='updateChannel(this)'>更新</a> &nbsp;"
					  	         		 + "<a class='btn btn-send " + statusClass + " btn-sm' href='javascript:void(0)' data-PrdId=" + row.prdId + " data-prdName=" + row.prdName + " data-spreadLink=" + row.spreadLink + " onclick='opDropChannel(this)'>删除</a> &nbsp;" + "";  	
							  return text;
						  }
					}
			  	],
				"sAjaxSource": ctx+"/spreadchannel/querySpreadChannelDetail.action?rand=" + Math.random(),
				"fnServerData": function ( sSource, aoData, fnCallback ) {//从服务器请求数据
			   			var data = $('#queryForm').serializeObject();
						
						data.aoData = JSON.stringify(aoData);
						$.ajax({
							"type": "POST",
							"dataType": 'json',
							"url": sSource,
							"data":data,
							"timeout":300000,
							"beforeSend": function() {
								// 显示loading
								showLoading();
							},
							"success": function(resp){
								console.info(resp);
								hideLoading();
								fnCallback(resp);
								initListPage();
								
							},		
							"error": function(XMLHttpRequest, textStatus, errorThrown) {
								alert('请求服务器错误,请刷新重试！！');//错误提示，包括服务器重启导致的session失效
							},			
							"complete": function () {
								hideLoading();
							}
					});
				},
				"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
					nRow.ondblclick = function() {
						openDialogWithRand("/spreadchannel/spreadChannelContent.jsp?op=1&prdId="+aData["prdId"]+ "&prdName=" + aData["prdName"] + "&spreadLink=" + aData["spreadLink"],800,500,"",function (data){});
					}; 
				},
				"sScrollXInner": "100%",
				"sScrollY": "100%",//如果不设置，IE会有问题
			    "aaSorting": [[2,"desc"]] //初始化加载，默认按第几列排序、排序方式（列从0开始计算）
			});
			
			
		});
	}
	
	/**
	 * 添加Channel的方法 
	 */
	function opAddChannel() {
		
		openDialogWithRand("/spreadchannel/getInfo.action?op=0",800,500,"",function (data){});
	}
	
	function updateChannel($this){
		var prdId = $this.getAttribute("data-prdId");
		var prdName = $this.getAttribute("data-prdName");
		var spreadLink = $this.getAttribute("data-spreadLink");
		var isapp = $this.getAttribute("data-isapp");
		openDialogWithRand("/spreadchannel/getInfo.action?op=1&prdId="+ prdId + "&prdName=" + prdName + "&spreadLink=" + spreadLink,800,500,"",function (data){});
	}
	
	
	
	/**
	 * 删除Channel的方法 
	 */
	function opDropChannel($this) {
		var prdId = $this.getAttribute("data-prdId");
		var prdName = $this.getAttribute("data-prdName");
		var spreadLink = $this.getAttribute("data-spreadLink");

		openDialogWithRand("/spreadchannel/getInfo.action?op=2&prdId="+ prdId + "&prdName=" + prdName + "&spreadLink=" + spreadLink,800,500,"",function (data){});

	}
	
	//打开窗口
	function openDialogWithRand(url,width,height,title,close){
		$(document).ExtDialog({
			url : ctx + url,
			width : width,
			height : height,
			title : title,
			close: close
		});
	}
	
	/*   jQuery(function() {
	 		$("#prdid").combobox();
	}); */
	
</script>